<template>
	<view class="list_item da-center mb-2 animated fadeInDown " :class="'delay-'+(index+1)" hover-class="bg-light-secondary">
		<image :src="item.img_url || '/static/images/xiaoxi.png'" mode=""></image>
		<view class="flex-1 pl-2 d-flex j-sb flex-column">
			<text class="font-md text-dark font-weight line-h">{{item.title || item.projectTitle}}</text>
			<text class="font-md text-muted spacing-2 line-h mt-1">{{item.enTitle||'XXXX'}}</text>
		</view>

		<u-icon name="arrow-right" color="#A0A0A0" size="32"></u-icon>

	</view>
</template>

<script>
	export default {
		props: {
			item: {
				type: Object,
				default: () => {}
			},
			index: {
				type: Number,
				default: () => 0
			}
		},
	}
</script>

<style lang="scss" scoped>
	.list_item {
		width: 100%;
		height: 157rpx;
		background: #FFFFFF;
		box-shadow: 2rpx 3rpx 10rpx 0px rgba(215, 75, 69, 0.1);
		border-radius: 10rpx;
		padding: 32rpx 26rpx 28rpx;

		image {
			width: 96rpx;
			height: 96rpx;
		}
	}
</style>
